<html>

	<head>
		<title></title>
		<meta charset="utf-8">
		<link href="css/common.css" rel="stylesheet" type="text/css">
		<style>
			body{background: #Fff;}
			.form>form>div label {display:inline-block;width:100px;text-align:right;}
			.form>form>div input{margin-bottom: 10px;}
			.jiance{width:98px;height:28px;border:1px solid #999;background:#e5e5e5;text-align: center;line-height: 26px;}
			.form>form.block-form>div {margin-top: 20px;}
			.filecontainer{position:relative;width:98px;height:30px;}
			.filecontainer .file,.filecontainer .text{    padding: 0px;width:150px;position:absolute;left:0px;top:0px;text-align: center;}
			.filecontainer .file{opacity:0;z-index:2;}
			.aa{height:30px;line-height:28px;background:#fff;border:1px solid #ddd;}
		</style>

		<body>
			<div class="form" style="padding:30px 20px;">
				    <div style="margin-top:0px;">
						<label class="inline-block" style="width:100px;text-align: right;">铺货来源：</label>
						<input type="radio" name="laiyuan" checked="checked" class="radio"  onclick="show(1)" value="1"> PDA采集数据
						<input type="radio" name="laiyuan" class="radio" onclick="show(2)" value="2"> 导入文件
					</div>
					
		
				<form class="block-form" id="pda">
					<input type="hidden" name="type" value="" id="type" />
						<div class="over-hidden">
							<label class="fl">请输入垛码：</label>
							<div class="fl">
								<input type="text" class="form-control" placeholder="请输入垛码" style="width: 270px;">
								<p>多个垛码可用英文格式的逗号“，”进行分隔</p>
							</div>
						</div>
						<div class="clearfix"></div>
						<div class="over-hidden">
							<label class="fl">每箱提取数量：</label>
							<div class="fl">
								<input type="text" placeholder="请输入每箱提取数量" style="width: 240px;">
								<div>
									<span class="btn bgblue border-radius text-center" style="width:79px;margin-right:40px;">检测</span>
									<span class="btn bgblue border-radius text-center" style="width:79px;">重置</span>
								</div>
								<p style="margin-top:28px;">共提取<span class="boxnumber" style="color:#17a3f7;padding:0 3px;">1000</span>箱<span style="color:#17a3f7;padding:0 3px;" class="pingnumber">100</span>瓶数据</p>
							</div>
						</div>

						<div class="text-center red"> 数据一旦提取生成铺货单无法撤销，请谨慎操作。</div>
 
					
					<div  class="text-center">
						<input type="submit" value="保存" class="aa bgblue border-radius" id="subButton" style="width:99px;margin-right:40px;height:30px;"/>
				    	<input type="button" value="返回" class="aa  border-radius" id="backButton" style="width:99px;height:30px;"/>
					</div>
				</form>
				
				<form class="block-form none" id="file">
				  	<input type="hidden" name="type" value="" id="type" />
						<div class="over-hidden">
							<label class="fl">二维码文件：</label>
							<div class="fl filecontainer">
								<input type="file" class=" file  border-radius" style="height:30px;" onchange="FileUpload_onselect(this)" accept="" />
								<input type="text" class=" text border-radius" style="height:30px;"  disabled="" value="请选择" />
								<span class="showFileName inline-block text-ellipsis" id="filename" style="margin-left:160px;width:100px;line-height: 27px;"></span>
							</div>
							
						</div>
						
						<div class="over-hidden" >
							<label class="fl hidden">二维码文件：</label>
							<div class="fl">
								<input type="button" value="上传 " class="text border-radius  none shangchuan " onclick="upload(this)" style="height:30px;width:99px;" >
								<div class="none"> 上传成功 </div>
							</div>
						</div>
							
					<div class="text-center">
						<input type="submit" value="保存" class="aa bgblue border-radius" id="subButton" style="width:99px;margin-right:40px;height:30px;"/>
				    	<input type="button" value="返回" class="aa  border-radius" id="backButton" style="width:99px;height:30px;"/>
					</div>
				</form>
			</div>

		 <script src="js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
			<script>
				//这个是修改文件上传的样式用到的直接调用就行了
				var filepath=document.getElementById("filename");
				function FileUpload_onselect(obj) {
					var filePath = obj.value;
					if(filePath.indexOf("jpg") != -1 || filePath.indexOf("png") != -1) {
						var arr = filePath.split('\\');
						var fileName = arr[arr.length - 1];
						filepath.innerHTML=fileName;
						$('.shangchuan').show();
					} else {
						$('.shangchuan').hide();
						filepath.innerHTML="您未上传文件，或者您上传文件类型有误！";
						return false;
					}
				}

				function show(type){
					if(type==1){
						$('#pda').show();
						$('#file').hide();
						$('#pda').find('#type').val(type);
					}else if(type==2){
						$('#pda').hide();
						$('#file').show();
						$('#file').find('#type').val(type);
					}
				}
				
				function upload(obj){
					$(obj).next().show();
				}
				
				
				//这是是检测的异步方法写在这里
				function ajaxFun() {

				}
				$(function() {
					//点击检测的事件
					$('.jiance').click(function() {
						ajaxFun();
						$('.boxnumber').html('500');
						$('.pingnumber').html('5000');
					})
				})
			</script>
		</body>

</html>
